import React, { PureComponent, createRef } from 'react'
import BScroll from 'better-scroll'



class BetterScroll extends PureComponent {
  
  wrapper = createRef();

  render() {
    return (
      <div className='wrapper' ref={this.wrapper} style={{ ...this.props.style, position: 'relative', overflow: 'hidden' }}>
        <div>
          {this.props.children}
        </div>
      </div>
    )
  }



  componentDidMount() {
    // const ver = navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/);
    /* alert(ver) */
    // 判断ios是否大于13.4
    // const isIosVerLgThan1304 = (ver && ver.length > 3 && ver[1] >= 13 && ver[2] >= 4) || (ver && ver.length > 3 && ver[1] >= 14);


    let probeType = 3
    if (this.props.probeType) {
      probeType = this.props.probeType
    }

    this.BScroll = new BScroll(this.wrapper.current, {
      // probeType  侦测 要不要侦测滚动 0 不侦测实时位置 1侦测
      // 2 在手指滚动过程中侦测，手指离开后惯性滚动不侦测
      // 3 只要是滚动都侦测
      probeType,
      // better-sroll 默认不监听按钮点击
      click: true,
      tap: 'tap',
      // 监听上来加载更多
      pullUpLoad: true,
      bounce: false,
      // 阻止冒泡事件
      stopPropagation: false,
      // 开启鼠标滚轮
      mouseWheel: true,
      // 立即停止滑动
      // bindToWrapper: true,
      useTransition: false,

    })

    // 上拉事件
    this.BScroll.on('pullingUp', () => {
      if (this.props.loadMore && this.props.isLoadMore) {
        this.props.loadMore()
      }
    })
    // 手指离开屏幕事件
    this.BScroll.on('scrollEnd', position => {

    })

    // 销毁
    this.BScroll.on('destroy', () => {
    })
    // 当ios系统大于13.4
    /* if (isIosVerLgThan1304) {
      this.BScroll.options.useTransition = false
    } */
    this.BScroll.on('scrollEnd', () => {
      this.BScroll.isInTransition = false
    })

    this.BScroll.scroller.hooks.on('resize', () => {
      this.BScroll.refresh()
    })


  }
  componentWillUnmount() {
    console.log(' BTSCroll 销毁了')
  }
}



export default BetterScroll;